<template>
	<view class="content">
		<view class="header">
			<!-- <a href=""><image class="logo" src="../../static/logo.png" mode=""></image></a> -->
			<image class="logo" src="../../static/logo.png" mode="right"></image>
			<a href="#page1"><image class="home" src="../../static/home.png" mode=""></image></a>
			<a href="#page3"><image class="home" src="../../static/service.png" mode=""></image></a>
			<a href="#page4"><image class="home" src="../../static/solution.png" mode=""></image></a>
			<a href="#page5"><image class="home" src="../../static/experience.png" mode=""></image></a>
			<a href="#page6" class="contact"><image class="contact" src="../../static/contact.png" mode="left"></image></a>
			
			
			
			<!-- <image class="logo" src="../../static/logo.png" mode=""></image>
			<image class="home" src="../../static/home.png" mode=""></image>
			<image class="home" src="../../static/service.png" mode=""></image>
			<image class="home" src="../../static/solution.png" mode=""></image>
			<image class="home" src="../../static/exerience.png" mode=""></image> -->
			<!-- <view class="blackbg">
				aa 
				<!-- <image class="contact" src="../../static/contact.png" mode="left"></image> -->
			<!-- </view> --> 
			<!-- <image class="contact" src="../../static/contact.png" mode="left"></image> -->
			
		</view>
		<!-- <a class="pageBg" href="#page1">11</a> -->
		<view class="pageBg" id="page1" >
			
			<image class="pageBgImg" src="../../static/page1.png" mode = "widthFix"></image>
			<a href="#page6"><image class="understand" src="../../static/understand.png" mode=""></image></a>
			
		</view>
		<view class="pageBg" id="page2">
			<image class="pageBgImg" src="../../static/page2.png" mode="widthFix"></image>
		</view>
		<view class="pageBg" id="page3">
			<image class="pageBgImg" src="../../static/page3.png" mode="widthFix"></image>
		</view>
		<view class="pageBg" id="page4">
			<image class="pageBgImg" src="../../static/page4.png" mode="widthFix"></image>
		</view>
		<view class="pageBg" id="page5">
			<image class="pageBgImg" src="../../static/page5.png" mode="widthFix"></image>
		</view>
		<view class="pageBg" id="page6">
			<image class="pageBgImg" src="../../static/page6.png" mode="widthFix"></image>
		</view>
		
		<a href="https://beian.miit.gov.cn/">
			<view class="bottom">Copyright © www.iyuanying.com All Rights Reserved 上海天精科技有限公司 | 沪ICP备2022020596号-1</view>
		</a>
		
		
	</view>
</template>

<script>
	export default {
		data() {
			return {
				title: 'Hello',
				}
				
		},
		
		
		methods: {

		}
	}
</script>

<style>
	
	.header{
		width: 100%;
		left: 0px;
		right: 0px;
		top: 0px;
		height: 88px;
		background-color: white;
		display: flex;
		flex-direction: row;
	}
	.logo{
		/* width: 588px; */
		height: 88px;
		-webkit-flex: 1;
		flex: 1;
		background: black;
	}
	.home{
		margin-left: 2px;
		width: 177px;
		height: 88px;
	}
	.contact{
		margin-left: 2px;
		margin-right: 0px; 
	    background: black;
		height: 88px;
		-webkit-flex: 1;
		flex: 1;
	}
	.blackbg{
		margin-left: 17px;
		margin-right: 0px;
		background: black;
	}
	.pageBg{
		position: relative;
		margin-top: 0px;
		margin-left: 0px;
		margin-right: 0px;
		-webkit-flex: 1;
		flex: 1;
		width: 100%;
		/* height: auto ; */
		background: #F5F5F5;
		padding-bottom: 0px;
	}
	.pageBgImg{
		
		margin-top: 0%;
		margin-left: 0px;
		margin-right: 0px;
		margin-bottom: 0;
		-webkit-flex: 1;
		flex: 1;
		width: 100%;
		/* height: auto ; */
	}
	.bottom{
		height: 50px;
		align-items: center;
		background: black;
		color: white;
		-webkit-justify-content: center;
		justify-content: center;
		text-align: center;
		line-height: 50px;
		font-size: 14px;
	}
	.understand{
		position: absolute;
		
		left: 13.5%;
		top: 80%;
		width: 103px;
		height: 41px;
		z-index: 2;
	}
	
	a:link{ text-decoration: none;}
	uni-image {
		display: block;
	}

</style>
